import React, { Component } from 'react'
import './daojishi.css'
export default class Daojishi extends Component {
    constructor() {
        super();
        this.state = {
            daojishi: ['00', '00', '00']
        }
        this.timer = null;
    }
    componentDidMount() {
        let { daojishiObj } = this.props;
        console.log(this.props);
        let cur = daojishiObj.currentTime;
        let end = daojishiObj.endTime;
        let cha = new Date(end) - new Date(cur);
        this.timer = setInterval(() => {
            cha -= 1000;
            this.setState({
                daojishi: this.formatTime(cha)
            })
        }, 1000)

    }
    componentWillUnmount() {
        this.timer = null;
    }
    formatTime = (date) => {
        let time = date / 1000;
        const s = time % 60;
        const m = Math.floor(time / 60 % 60);
        const h = Math.floor(time / 60 / 60 % 60);
        return [h, m, s].map(this.addZero);
    }
    addZero = (n) => {
        return n < 10 ? '0' + n : n;
    }
    render() {
        let { daojishi } = this.state;
        return (
            <div className='daojishi'>
                <span className='times-seckill'>距结束</span>
                <span className='times-seckill'>{daojishi[0]}</span>
                <span>:</span>
                <span className='times-seckill'>{daojishi[1]}</span>
                <span >:</span>
                <span className='times-seckill'>{daojishi[2]}</span>
            </div>
        )
    }
}
